/* ОТКРЫТИЕ САМОГО ВИДЕО ПЛЕЕРА */
/* .Window_File_Video{
  transform: translateY(-100%);
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}

.Window_File_Video_OPENER{
  transform: translateY(0%);
  visibility: visible;
  opacity: 1;
}

.Window_File_Video_CLOSER{
  transform: translateY(100%);
  visibility: hidden;
  opacity: 0;
} */
/* ОТКРЫТИЕ САМОГО ВИДЕО ПЛЕЕРА */

/* ---------- Общие стили ---------- */
.Window_File_Video{
  background:rgb(255, 255, 255);
  color:#fff;
  display:flex;
  justify-content:center;
  align-items: center;
  /* padding:30px; */
  width: 100%;
  height: 100%;
  box-sizing:border-box;
  user-select: none;
  outline: none !important;
-webkit-tap-highlight-color: transparent;
position: fixed;
top: 0;
left: 0;
z-index: 110;

}

.Close_Window_File_Video{
position: absolute;
top: 0;
left: 0;
width: 30px;
height: 30px;
margin: 6px 0px 0px 6px;
background: white;
border-radius: 50%;
padding: 6px;
color: black;
cursor: pointer;
transition: 0.2s;
z-index: 50;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.200);
}

.Close_Window_File_Video:hover{
rotate: 90deg;
}

:root{
  --control-height: 48px;
  --bg-gradient: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0));
}
body{
  /* user-select: none; */
  outline: none !important;
-webkit-tap-highlight-color: transparent;
}

.body:focus {
outline: none !important;
}

.body {
-webkit-tap-highlight-color: transparent; /* если кликаем по этому блоку */
outline: none;
}

.body {
-webkit-tap-highlight-color: transparent;
}

.center_F_E{ display:flex; justify-content:center; }
.left_F_E{ display:flex; justify-content:left; }
.right_F_E{ display:flex; justify-content:right; }

/* ---------- Контейнер видео ---------- */

.CONTAINER_FOR_ALL{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.Position_Video{
  /* border-radius:15px; */
  /* width:735px;
  height:415px; */
  width: 100%;
  height: 100%;
  cursor:pointer;
  overflow:hidden;
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  flex-direction: column;
  background:#000;
  margin: 0px 0px 0px 0px;
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
}

.vide_iframe_You_tube_2{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  background:#000;
  user-select: none;
  outline: none !important;
-webkit-tap-highlight-color: transparent;
touch-action: none;

}

.vide_iframe_You_tube_2:focus {
outline: none !important;
touch-action: none;
}

.Position_play-icon {
-webkit-tap-highlight-color: transparent;
touch-action: none;
/* если кликаем по этому блоку */
outline: none;
}

.play-icon {
-webkit-tap-highlight-color: transparent;
touch-action: none;
}

.FULL_SCREEN_OBJECT{
  object-fit: contain;
}

.FULL_SCREEN_OBJECT.FULL_SCREEN_OPENER{
  object-fit: cover;
}

/* ---------- Play icon overlay ---------- */
.Position_play-icon{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  transition:opacity 220ms ease, transform 220ms ease;
  opacity:0;
  pointer-events:none;
  background: rgba(255, 255, 255, 0);
}
.Position_play-icon.visible{
  opacity:1;
  pointer-events:auto;
}
.Position_play-icon .play-icon{
  width:64px;
  height:64px;
  color:white;
  opacity:0.95;
  cursor:pointer;
  user-select:none;
  transform:scale(1);
  transition: transform 180ms ease, opacity 180ms ease;
  filter: drop-shadow(0 6px 20px rgba(0,0,0,0.7));
}

/* ---------- Контролы (progress + time + volume) ---------- */
.video-controls{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:10px 80px 10px 12px;
  box-sizing:border-box;
  background: var(--bg-gradient);
  display:flex;
  gap:12px;
  align-items:center;
  transition: 0.2s ease;
  z-index:5;
  height:var(--control-height);
}
.Position_Video.hide-controls .video-controls{
  opacity:0;
  translate: 0px 30px;
  pointer-events:none;
}
.time {
  color:#fff;
  font-size:13px;
  min-width:62px;
  text-align:center;
  user-select:none;
}

/* layout: left = volume, then current time, then progress, then duration */
.controls-left { display:flex; align-items:center; gap:8px; min-width:130px; }
.controls-mid { flex:1; display:flex; align-items:center; gap:12px; }

/* ---------- Progress styles (shared with volume) ---------- */
.slider {
  --h:8px;
  flex:1;
  height:var(--h);
  border-radius:6px;
  background:rgba(255,255,255,0.18);
  position:relative;
  cursor:pointer;
  overflow:visible;
  display:block;
  touch-action:none;
}
.slider .buffer { position:absolute; left:0; top:0; bottom:0; width:0%; background:rgba(255,255,255,0.18); border-radius:6px; }
.slider .played { position:absolute; left:0; top:0; bottom:0; width:0%; background:rgba(255,255,255,0.85); border-radius:6px; transition:width 0.05s linear; }
.slider .thumb {
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%);
  width:14px; height:14px; border-radius:50%;
  background:rgb(44, 128, 255); box-shadow:0 1px 4px rgba(0,0,0,0.6); display:none;
  touch-action:none;
}
.slider:hover .thumb,
.slider.dragging .thumb,
.slider.touch-active .thumb {
  display:block;
}
.slider .hover-time{
  position:absolute; bottom:110%; transform:translateX(-50%);
  padding:4px 6px; font-size:12px; color:#fff; background:rgba(44, 128, 255, 0.7);
  border-radius:4px; white-space:nowrap; pointer-events:none; display:none;
}
.slider:hover .hover-time { display:block; }

/* ---------- Volume slider smaller ---------- */
.volume-wrapper{ display:flex; align-items:center; gap:8px; width:140px; min-width:140px; }
.volume-icon{
  width:28px; height:28px; display:flex; align-items:center; justify-content:center; cursor:pointer;
  user-select:none;
}
.volume-slider{ width:90px; min-width:90px; max-width:180px; }

/* ---------- small niceties ---------- */
.btn-icon { background:transparent; border:0; outline:0; color:inherit; cursor:pointer; padding:6px; display:inline-flex; align-items:center; justify-content:center; }

.Icon_loud{
    width: 25px;
    height: 25px;
    flex-shrink: 0;
    color: white;
}

.Icon_mute{
    width: 25px;
    height: 25px;
    flex-shrink: 0;
    color: white;
}

.Double_Touch_Left_Animation{
  position: absolute;
  top: 0px;
  left: -200px;
  width: 200px;
  height: 100%;
  background: rgba(0, 0, 0, 0.200);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0px 60% 60% 0px;
  transition: 0.15s;
  opacity: 0;
  visibility: hidden;
}

.Double_Touch_Left_Animation.Double_Touch_Left_Animation_OPENER{
  opacity: 1;
  visibility: visible;
  left: 0px;
}

.Double_Touch_Left_Animation_Text{
  color: black;
  padding: 12px;
  font-size: 35px;
  line-height: 20px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.427);
  border-radius: 15px;
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  transition: 0.25s;
  position: relative;
  opacity: 0;
  visibility: hidden;
  left: -200px;
}

.Double_Touch_Left_Animation_Text.Double_Touch_Left_Animation_OPENER{
  opacity: 1;
  visibility: visible;
  left: 0px;
}






.Double_Touch_Right_Animation{
  position: absolute;
  top: 0px;
  right: -200px;
  width: 200px;
  height: 100%;
  background: rgba(0, 0, 0, 0.200);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 60% 0px 0px 60%;
  transition: 0.15s;
  opacity: 0;
  visibility: hidden;
}

.Double_Touch_Right_Animation.Double_Touch_Right_Animation_OPENER{
  opacity: 1;
  visibility: visible;
  right: 0px;
}

.Double_Touch_Right_Animation_Text{
  color: black;
  padding: 12px;
  font-size: 35px;
  line-height: 20px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.427);
  border-radius: 15px;
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  transition: 0.25s;
  position: relative;
  opacity: 0;
  visibility: hidden;
  right: -200px;
}

.Double_Touch_Right_Animation_Text.Double_Touch_Right_Animation_OPENER{
  opacity: 1;
  visibility: visible;
  right: 0px;
}

.video_controls_Icon_Video_Speed{
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    padding: 3px;
    background: rgb(255, 255, 255);
    cursor: pointer;
    margin: 0px 0px 0px 20px;
    color: rgb(0, 0, 0);
    transition: 0.15s;
    border: 1px rgb(164, 164, 164) solid;
    
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 60;
}

.video_controls_Icon_Video_Speed:hover{
  background: rgb(231, 231, 231);
  color: black;
}






.Window_Video_Speed_Position{
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: right;
  align-items: center;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.150);
  backdrop-filter: blur(2px);
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
}

.Window_Video_Speed_Position.Window_Video_Speed_OPENER{
  opacity: 1;
  visibility: visible;
}

.Window_Video_Speed{
    position: relative;
    bottom: -100%;
    right: -270px;
    width: 200px;
    height: 90%;
    margin: 20px 50px 20px 0px;
    background: white;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    scale: 0.1;
}

.Window_Video_Speed.Window_Video_Speed_OPENER{
    opacity: 1;
    visibility: visible;
    bottom: 0%;
    right: 0px;
    scale: 1;
}

.Window_Video_Speed_Btn{
    cursor: pointer;
    border-radius: 5px;
    background: rgb(232, 232, 232);
    padding: 4px 0px;
    font-size: 14px;
    color: black;
    font-weight: 600;
    line-height: 18px;
    margin: 5px 5px;
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Window_Video_Speed_Btn:hover{
    background: rgb(220, 220, 220);
}

.Window_Video_Speed_Btn.active-speed {
    background-color: #007bff;
    color: white;
}

.Window_Video_Speed_Scroll_Position{
  flex-grow: 1;
  width: 100%;
  margin: 0px 0px 0px 0px;
  background: white;
  overflow-y: scroll;
  display: flex;
  justify-content: center;
}

.Window_Video_Speed_Scroll_Position::-webkit-scrollbar {display: none;}

.Window_Video_Speed_Scroll{
  height: 100%;
  width: 100%;
  margin: 0px 2px 0px 2px;
  background: white;
  overflow-y: scroll;
  display: flex;
  flex-direction: column;
}

.Window_Video_Speed_Scroll::-webkit-scrollbar {width: 3px; height: 3px;}
/* .Window_Video_Speed_Scroll::-webkit-scrollbar {display: none;} */
.Window_Video_Speed_Scroll::-webkit-scrollbar-track {background-color: #ffffff00; /* Цвет фона скроллбара *//* background: url("favicon.png")center / cover no-repeat;*/} 
.Window_Video_Speed_Scroll::-webkit-scrollbar-thumb {background-color: #cdcdcd; /* Цвет ползунка скроллбара */border-radius: 50px; /* Закругленные углы ползунка */}
.Window_Video_Speed_Scroll::-webkit-scrollbar-thumb:hover {background-color: #c4c4c4; /* Цвет ползунка при наведении */}

.Window_Video_Speed_Poster_Text_and_Icon{
  display: flex;
  justify-content: left;
  align-items: center;
  width: 100%;
  background: white;
  margin: 0px 0px 0px 0px;
  padding: 6px 0px;
  border-bottom: 2px solid rgb(189, 189, 189);
}

.Window_Video_Speed_Poster_Icon{
  width: 20px;
  height: 20px;
  border-radius: 50%;
  padding: 5px;
  background: rgb(218, 218, 218);
  flex-shrink: 0;
  margin: 0px 9px 0px 5px;
  color: black;
  stroke-width: 1.5px;
  transition: 0.15s;
}

.Window_Video_Speed_Poster_Icon:hover{
  background: rgb(219, 245, 255);
}

.Window_Video_Speed_Poster_Text{
  font-size: 16px;
  color: black;
  font-weight: 600;
  line-height: 18px;
  margin: 0px 0px 0px 0px;
}

.time-current{
  margin: 0px -15px 0px 15px;
}

.time-duration{
  margin: 0px 0px 0px -15px;
}

/* .Position_play-icon_Mobilka{
  display: none;
  justify-content:center;
  align-items:center;
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  transition:opacity 220ms ease, transform 220ms ease;
  opacity:0;
  pointer-events:none;
  background: rgba(255, 255, 255, 0);
}

.Position_play-icon_Mobilka.visible_Mobilka{
  opacity:1;
  pointer-events:auto;
}
.Position_play-icon_Mobilka .play-icon{
  width:64px;
  height:64px;
  color:white;
  opacity:0.95;
  cursor:pointer;
  user-select:none;
  transform:scale(1);
  transition: transform 180ms ease, opacity 180ms ease;
  filter: drop-shadow(0 6px 20px rgba(0,0,0,0.7));
} */




/* СТИЛИ ДЛЯ ВСПЛЫВАЮЩЕГО ОКНА ТРИ ТОЧКИ */
/* .Window_Functions_4_DOTS_Backpart{
  display: flex;
  justify-content: right;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.200);
  backdrop-filter: blur(3px);
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
}

.Window_Functions_4_DOTS_Backpart.Window_Functions_4_DOTS_OPENER{
  opacity: 1;
  visibility: visible;
}

.Window_Functions_4_DOTS_Backpart.Window_Functions_4_DOTS_CLOSER{
  opacity: 0;
  visibility: hidden;
}

.Window_Functions_4_DOTS{
  border-radius: 20px;
  background: white;
  width: 250px;
  display: flex;
  flex-direction: column;
  transition: 0.3s;
  position: relative;
  opacity: 0;
  visibility: hidden;
  left: 450px;
  top: 450px;
  margin: 0px 50px 20px 0px;
}

.Window_Functions_4_DOTS.Window_Functions_4_DOTS_OPENER{
  left: 0;
  top: 0;
  opacity: 1;
  visibility: visible;
}

.Window_Functions_4_DOTS.Window_Functions_4_DOTS_CLOSER{
  transform: translateY(100%);
  opacity: 0;
  visibility: hidden;
}

.Window_Functions_4_DOTS_Block_1{
  width: 100%;
  display: flex;
  flex-direction: column;
  margin: 15px 10px 0px 10px;
}

.Window_Functions_4_DOTS_Block_1_Text{
  font-size: 14px;
  color: rgb(156, 156, 156);
  line-height: 18px;
  font-weight: 400;
  margin: 10px 0px 4px 0px;
}

.Window_Functions_4_DOTS_Block_1_INPUT_and_ICON{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 0px 0px 0px 0px;
}

.Window_Functions_4_DOTS_Block_1_INPUT{
  width: 100%;
  outline: none;
  border: none;
  background: white;
  margin: 0px 0px 0px 0px;
  font-family: monospace;
  font-size: 16px;
  line-height: 18px;
  color: black;
  font-weight: 400;
  border-radius: 5px;
  box-shadow: 0px 0px 6px #0000001f;
  padding: 5px 5px 5px 5px;
}

.Window_Functions_4_DOTS_Block_1_ICON_Save_Name{
  padding: 5px;
  cursor: pointer;
  transition: 0.1s;
  background: #7addff;
  color: black;
  border-radius: 50%;
  margin: 0px 0px 0px 10px;
  flex-shrink: 0;
  display: none;
}

.Window_Functions_4_DOTS_Block_1_ICON_Save_Name.Window_Functions_4_DOTS_Block_1_ICON_Save_Name_OPENER{
  display: block;
}

.Window_Functions_4_DOTS_Block_1_ICON_Save_Name:hover{
  background: #bcff7a;
}

.Window_Functions_8_DOTS_Block_1_INPUT_OGRANICHITEL_Part{
  font-size: 14px;
  color: black;
  line-height: 17px;
  font-weight: 600;
  margin: 5px 0px 0px 0px;
  overflow: hidden;
}

.Window_Functions_4_DOTS_Block_2{
  display: flex;
  justify-content: left;
  align-items: center;
  width: 100%;
  margin: 10px 8px 15px 8px;
}

.Window_Functions_4_DOTS_Block_2_ICON_and_Text{
  display: flex;
  justify-content: left;
  align-items: center;
  width: 100%;
  cursor: pointer;
  transition: 0.1s;
  background: white;
  margin: 10px 10px 5px 10px;
  border-radius: 5px;
  padding: 5px 10px;
  box-shadow: 0px 0px 6px #0000001f;
  transition: 0.2s;
}

.Window_Functions_4_DOTS_Block_2_ICON_and_Text:hover{
  background: #7addff;
}

.Window_Functions_4_DOTS_Block_2_ICON_and_Text.Window_Functions_4_DOTS_Block_2_ICON_and_Text_OPENER{
  background: #7addff
}

.Window_Functions_4_DOTS_Block_2_ICON{
  flex-shrink: 0;
  color: black;
  margin: 0px 0px 0px 0px;
  width: 25px;
  height: 25px;
  stroke-width: 1.5px;
  transition: 0.2s;
  rotate: 0deg;
}

.not_Full_Screen_Icon{
display: none;
}

.not_Full_Screen_Icon.FULL_SCREEN_OPENER{
display: block;
}

.Full_Screen_Icon{
display: block;
}

.Full_Screen_Icon.FULL_SCREEN_OPENER{
display: none;
}

.Window_Functions_4_DOTS_Block_2_ICON.Window_Functions_4_DOTS_Block_2_ICON_and_Text_OPENER{
  stroke: white;
  fill: white;
  rotate: 145deg;
}

.Window_Functions_4_DOTS_Block_2_Text{
  font-size: 16px;
  color: black;
  line-height: 18px;
  font-weight: 400;
  margin: 0px 0px 0px 10px;
  transition: 0.2s;
}

.Window_Functions_4_DOTS_Block_4{
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  margin: 10px 0px 20px 0px;
  position: relative;
  cursor: pointer;
  transition: background 0.15s, width 0.3s;
  border-radius: 50%;
  padding: 6px;
  box-shadow: 0px 0px 6px #0000001f;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.Window_Functions_4_DOTS_Block_4.Final_BTN_delete_Object_OPENER{
  width: 220px;
  border-radius: 6px;
  background: unset;
  box-shadow: unset;
}

.Window_Functions_4_DOTS_Block_4:hover .Window_Functions_4_DOTS_Block_4_ICON_Delete{
  stroke: white;
}

.Window_Functions_4_DOTS_Block_4_ICON_Delete{
  width: 100%;
  height: 100%;
  color: white;
  stroke-width: 1.5px;
  transition: 0.3s;
  opacity: 1;
  visibility: visible;
  background: #ff7f7f;
  padding: 6px;
  flex-shrink: 0;
}

.Window_Functions_4_DOTS_Block_4_ICON_Delete:hover{
  background: red;
}

.Window_Functions_4_DOTS_Block_4_ICON_Delete.Final_BTN_delete_Object_OPENER{
  opacity: 0;
  visibility: hidden;
  translate: -15px 0px;
}

.Window_Functions_4_DOTS_Block_4_Part_Cancel_Deleting_And_Main_BTN_DELETE_OBJECT{
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
}

.Window_Functions_4_DOTS_Block_4_Part_Cancel_Deleting_And_Main_BTN_DELETE_OBJECT.Final_BTN_delete_Object_OPENER{
  opacity: 1;
  visibility: visible;
}

.Window_Functions_4_DOTS_Block_4_Part_Cancel_Deleting_icon{
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  margin: 0px 4px 0px 0px;
  background: white;
  cursor: pointer;
  transition: 0.1s;
  border-radius: 50%;
  padding: 5px;
  stroke-width: 1.5;
  color: black;
}

.Window_Functions_4_DOTS_Block_4_Part_Cancel_Deleting_icon:hover{
  background: #f0f0f0;
}

.Window_Functions_4_DOTS_Block_4_Part_Text{
  font-size: 16px;
  color: black;
  line-height: 18px;
  font-weight: 400;
  margin: 0px 0px 0px -6px;
  white-space: nowrap;
}

.Window_Functions_4_DOTS_Block_4_Part_Main_BTN_DELETE_OBJECT{
  padding: 4px 12px;
  font-size: 16px;
  line-height: 18px;
  color: black;
  border-radius: 5px;
  border: 1px rgb(217, 217, 217) solid;
  background: white;
  transition: 0.15s;
}

.Window_Functions_4_DOTS_Block_4_Part_Main_BTN_DELETE_OBJECT:hover{
  background: #f0f0f0;
}

.Window_Functions_4_DOTS_Close_ICON{
  position: absolute;
  top: 0;
  right: 0;
  width: 23px;
  height: 23px;
  border-radius: 50%;
  cursor: pointer;
  transition: 0.2s;
  flex-shrink: 0;
  margin: 8px 8px 0px 0px;
  color: black;
}

.Window_Functions_4_DOTS_Close_ICON:hover{
  rotate: 90deg;
}











.Window_Functions_4_DOTS_Block_1_INPUT_OGRANICHITEL_Part.OGRANICHITEL_4_Numbers_Color_4 {
color: red;
}

.OGRANICHITEL_4_Numbers_Fliper_4 {
display: inline-block;
animation: OGRANICHITEL_4_Numbers_Fliper_4 0.3s forwards;
}

@keyframes OGRANICHITEL_4_Numbers_Fliper_4 {
0% {
  transform: translateY(0);
  opacity: 1;
}
50% {
  transform: translateY(-100%);
  opacity: 0;
}
51% {
  transform: translateY(100%);
  opacity: 0;
}
100% {
  transform: translateY(0);
  opacity: 1;
}
} */
/* СТИЛИ ДЛЯ ВСПЛЫВАЮЩЕГО ОКНА ТРИ ТОЧКИ */









/* ---------- Responsive: mobile support ---------- */
@media only screen and (max-width: 1024px){
  /* .play-icon {
      position: relative;
      z-index: 20;
  }

  .Position_play-icon {
    position: absolute;
    z-index: 10;
}

.video-controls{
  z-index: 30;
} */
}

@media only screen and (max-width:768px){
  .video_controls_Icon_Video_Speed {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    padding: 3px;
    /* background: rgba(255, 255, 255, 0.345); */
    cursor: pointer;
    margin: 0px 0px 0px 5px;
    /* color: white; */
    transition: 0.15s;
}

.time-current {
    margin: 0px -15px 0px -10px;
}

.video-controls {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
}

.controls-mid {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin: 0px 0px 0px 0px;
}

.video-controls {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 5px 80px 15px 5px;
    box-sizing: border-box;
    background: var(--bg-gradient);
    display: flex;
    gap: 12px;
    align-items: flex-start;
    transition: 0.2s ease;
    z-index: 5;
    height: var(--control-height);
}

.volume-wrapper {
display: flex;
align-items: center;
gap: 8px;
width: 200px;
min-width: 140px;
}

.volume-wrapper {
display: flex;
align-items: center;
gap: 8px;
width: 200px;
min-width: 140px;
margin: 0px 0px -5px 0px;
}
}

@media only screen and (max-width:480px){
  .video_controls_Icon_Video_Speed {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    padding: 3px;
    /* background: rgba(255, 255, 255, 0.345); */
    cursor: pointer;
    margin: 0px 0px 0px -15px;
    /* color: white; */
    transition: 0.15s;
}

.Window_Functions_4_DOTS {
border-radius: 20px;
background: white;
width: 100%;
display: flex;
flex-direction: column;
transition: 0.3s;
position: relative;
opacity: 0;
visibility: hidden;
left: 450px;
top: 450px;
margin: 0px 20px 20px 20px;
}

.Window_Video_Speed {
position: relative;
bottom: -100%;
right: -270px;
width: 100%;
height: 90%;
margin: 20px 70px 20px 70px;
background: white;
border-radius: 12px;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: center;
/* z-index: 10; */
opacity: 0;
visibility: hidden;
transition: 0.3s;
scale: 0.1;
}
}